// import React from 'react';
import styles from './index.less';
// import { UserOutlined, LogoutOutlined } from '@ant-design/icons';
// import ProSkeleton from '@ant-design/pro-components';
import { useModel, useSearchParams, history } from '@umijs/max';
// import IDCard from '@/components/IDCard';
import { PLATFORM_URL } from '@/constants';
import { clearLogin, setCookie, getDomain, getCookie, setAccessToken, checkTarget } from '@/utils/utils';
import { Spin } from 'antd';
import { useState } from 'react';
// import { history, useModel } from '@umijs/max';

export default () => {
  const [searchParams] = useSearchParams();
  const { GetRoleList, platformType } = useModel('Global');
  const [loading, setLoading] = useState(false)
  const target = checkTarget(searchParams.get('target'));

  const pick = (platform_type: number) => {
    setLoading(true)
    const roleList = GetRoleList()
    const selected = roleList[platform_type]
    const token = selected['jwt-token']
    const autoLogin = getCookie('autoL') === 'true'
    
    setAccessToken(platform_type, token, autoLogin)
    setCookie('autoL', autoLogin.toString(), getDomain(), autoLogin);
    setTimeout(() => {
      history.push((PLATFORM_URL as any)[platform_type] + target);
    }, 200);
  };

  const goBack = () => {
    clearLogin();
    history.replace(`/main/login?target=${target}`);
  };

  return (
    <div className={styles.role_picker}>
      <div className={styles.role_picker_title}>
        <span>请选择身份</span>
        <a className={styles.return_btn} onClick={goBack}>
          返回登录
        </a>
      </div>
      <Spin spinning={loading}>
        <div className={styles.card_block}>
          <div className={styles.card_item} onClick={() => pick(0)}>
            {/* <IDCard type={0} /> */}
            <img className={styles.card_avater} src={require('@/assets/login/role_platform.png')}></img>
            <div className={styles.role_name}>我是平台方</div>
          </div>
          <div className={styles.card_item} onClick={() => pick(1)}>
            {/* <IDCard type={1} /> */}
            <img className={styles.card_avater} src={require('@/assets/login/role_store.png')}></img>
            <div className={styles.role_name}>我是商家</div>
          </div>
        </div>
      </Spin>
    </div>
  );
};
